ion-app.app-root.md {
  .button-md {
    min-height: $button-md-height;
  }

  // Light buttons color.
  .button-md-light {
    color: color($colors, primary, base);
  }

  .col[align-self-stretch] .card-md {
    height: calc(100% - #{($card-md-margin-end + $card-md-margin-start)});
  }

  .bar-buttons core-context-menu .button-clear-md {
    color: $toolbar-md-button-color;
  }

  .item-md ion-spinner[item-start] + .item-inner,
  .item-md ion-spinner[item-start] + .item-input {
    @include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2) - 1, null);
  }

  .item-md ion-icon[item-start] + .item-inner,
  .item-md ion-icon[item-start] + .item-input,
  .item-md img[item-start] + .item-inner,
  .item-md img[item-start] + .item-input {
    @include margin-horizontal($item-md-padding-start, null);
  }

  .item-md ion-avatar[item-start] + .item-inner,
  .item-md ion-avatar[item-start] + .item-input {
    @include margin-horizontal(0, null);
  }

  @each $color-name, $color-base, $color-contrast in get-colors($colors-md) {
    .core-#{$color-name}-card {
      @extend .card-md;
      @extend .card-content-md;

      @include darkmode() {
        background-color: $core-dark-item-bg-color;
      }

      &[icon-start] {
        @include safe-area-padding(null, null, null, $card-md-padding-left * 2 + 20);

        ion-icon {
          @include safe-area-position(null, null, null, $card-md-padding-left);
        }
      }
    }
  }

  .core-avoid-header ion-content {
      top: $navbar-md-height;
      height: calc(100% - #{($navbar-md-height)});
  }

  // Different levels of padding.
  @for $i from 0 through 15 {
    .core-padding-#{$i} {
      @include padding(null, null, null, 15px * $i + $item-md-padding-start);
    }
  }

  .action-sheet-md {
    .action-sheet-title,
    .action-sheet-container > .action-sheet-group:first-child {
      box-shadow: 0 3px 5px $gray;
    }

    .action-sheet-title {
      padding-top: 0;
      margin-top: $action-sheet-md-title-padding-top;
    }

    @media (min-height: 500px) {
      .action-sheet-wrapper {
        bottom: 0;
        top: initial;
        max-height: 50%;
        height: 100%;
      }
    }
  }
}

.platform-android4_4 .bar-buttons-md {
  display: flex;
}